<template>
    <div class="tip">
        <!-- 常见科室 -->
        <div class="deparment">
            <div class="header">
                <div class="left">
                    <svg t="1688107254033" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="2351" width="16" height="16">
                        <path
                            d="M817.3 305.3H762V250c0-61.1-49.5-110.7-110.7-110.7H374.7C313.5 139.3 264 188.8 264 250v55.3h-55.3C147.5 305.3 98 354.8 98 416v359.7c0 61.1 49.5 110.7 110.7 110.7h608.7c61.1 0 110.7-49.5 110.7-110.7V416c-0.1-61.2-49.6-110.7-110.8-110.7z m-498-55.3c0-30.5 24.8-55.3 55.3-55.3h276.7c30.5 0 55.3 24.8 55.3 55.3v55.3H319.3V250z m553.4 525.6c0 30.5-24.8 55.3-55.3 55.3H208.7c-30.5 0-55.3-24.8-55.3-55.3V416c0-30.5 24.8-55.3 55.3-55.3H817.3c30.5 0 55.3 24.8 55.3 55.3v359.6z"
                            p-id="2352"></path>
                        <path d="M540.7 471.3h-55.4V582H374.7v55.3h110.6V748h55.4V637.3h110.6V582H540.7z" p-id="2353">
                        </path>
                    </svg>
                    <span>常见科室</span>
                </div>
                <div class="right">
                    <span>全部</span>
                    <svg t="1688107319374" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="3499" width="16" height="16">
                        <path
                            d="M512 1024C229.248 1024 0 794.752 0 512S229.248 0 512 0s512 229.248 512 512-229.248 512-512 512z m200.746667-478.506667l1.749333-1.664 30.165333-30.165333-330.496-330.581333a42.837333 42.837333 0 0 0-60.288 0 42.538667 42.538667 0 0 0 0 60.330666l270.08 270.165334-270.08 269.952a42.496 42.496 0 0 0 0 60.288c16.64 16.64 43.861333 16.469333 60.288 0.042666l298.581334-298.368z"
                            fill="#3D3D3D" p-id="3500"></path>
                    </svg>
                </div>
            </div>
            <div class="content">
                <ul>
                    <li>神经内科</li>
                    <li>消化内科</li>
                    <li>呼吸内科</li>
                    <li>神经外科</li>
                    <li>内科</li>
                    <li>妇科</li>
                    <li>产科</li>
                    <li>儿科</li>
                </ul>
            </div>
        </div>
        <!-- 平台公告 -->
        <div class="notice">
            <div class="header">
                <div class="left">
                    <svg t="1688107870150" class="icon" viewBox="0 0 1126 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="4606" width="16" height="16">
                        <path
                            d="M384 399.36c-5.12 5.12-8.533333 8.533333-17.066667 8.533333h-78.506666c-13.653333 0-25.6 13.653333-25.6 25.6v160.426667c0 13.653333 13.653333 25.6 25.6 25.6h78.506666c5.12 0 13.653333 5.12 17.066667 8.533333l155.306667 160.426667c5.12 5.12 5.12 8.533333 8.533333 8.533333V232.106667l-8.533333 8.533333-155.306667 158.72z"
                            fill="#19ADF4" p-id="4607"></path>
                        <path
                            d="M742.4 0h-358.4C199.68 0 51.2 148.48 51.2 332.8v358.4C51.2 875.52 199.68 1024 384 1024h358.4C926.72 1024 1075.2 875.52 1075.2 691.2v-358.4C1075.2 148.48 926.72 0 742.4 0z m-143.36 805.546667c0 39.253333-22.186667 51.2-39.253333 51.2-17.066667 0-34.133333-8.533333-56.32-30.72l-145.066667-153.6h-64.853333c-42.666667 0-78.506667-39.253333-78.506667-81.92v-160.426667c0-47.786667 34.133333-81.92 78.506667-81.92H358.4l146.773333-150.186667c22.186667-22.186667 39.253333-30.72 56.32-30.72s39.253333 13.653333 39.253334 47.786667v590.506667z m121.173333-138.24l-8.533333 13.653333c-5.12 8.533333-13.653333 13.653333-22.186667 13.653333-5.12 0-8.533333 0-13.653333-5.12-8.533333-8.533333-13.653333-25.6-5.12-39.253333l8.533333-13.653333c25.6-34.133333 47.786667-68.266667 47.786667-124.586667s-22.186667-87.04-47.786667-121.173333c-5.12-5.12-8.533333-8.533333-13.653333-17.066667-8.533333-13.653333-8.533333-30.72 5.12-39.253333 8.533333-8.533333 25.6-8.533333 34.133333 5.12 5.12 5.12 8.533333 13.653333 13.653334 17.066666 30.72 39.253333 56.32 81.92 59.733333 150.186667 3.413333 73.386667-32.426667 121.173333-58.026667 160.426667z m78.506667 112.64c-5.12 5.12-8.533333 8.533333-17.066667 8.533333s-13.653333-5.12-17.066666-8.533333c-13.653333-13.653333-13.653333-25.6-5.12-39.253334 51.2-59.733333 98.986667-129.706667 98.986666-228.693333 0-95.573333-47.786667-168.96-98.986666-228.693333-8.533333-13.653333-5.12-30.72 5.12-39.253334 8.533333-8.533333 25.6-8.533333 34.133333 5.12 51.2 64.853333 107.52 146.773333 112.64 267.946667-1.706667 110.933333-56.32 197.973333-112.64 262.826667z"
                            fill="#19ADF4" p-id="4608"></path>
                    </svg>
                    <span>平台公告</span>
                </div>
                <div class="right">
                    <span>全部</span>
                    <svg t="1688107319374" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="3499" width="16" height="16">
                        <path
                            d="M512 1024C229.248 1024 0 794.752 0 512S229.248 0 512 0s512 229.248 512 512-229.248 512-512 512z m200.746667-478.506667l1.749333-1.664 30.165333-30.165333-330.496-330.581333a42.837333 42.837333 0 0 0-60.288 0 42.538667 42.538667 0 0 0 0 60.330666l270.08 270.165334-270.08 269.952a42.496 42.496 0 0 0 0 60.288c16.64 16.64 43.861333 16.469333 60.288 0.042666l298.581334-298.368z"
                            fill="#3D3D3D" p-id="3500"></path>
                    </svg>
                </div>
            </div>
            <div class="content">
                <ul>
                    <li>关于延长北京大学国际医院放假的通知</li>
                    <li>北京中医大学东方医院部分科室医生门诊</li>
                    <li>武警总医院号源暂停更新通知</li>
                </ul>
            </div>
        </div>
        <!-- 停诊公告 -->
        <div class="notice">
            <div class="header">
                <div class="left">
                    <svg t="1688108226539" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="4850" width="16" height="16">
                        <path
                            d="M736 768h-448a32 32 0 0 1 0-64h448a32 32 0 0 1 0 64z m-44.8-415.552l-147.669333-147.669333a61.994667 61.994667 0 0 1-62.848 0l-147.669334 147.669333a32.554667 32.554667 0 0 1-46.037333-46.037333l161.578667-161.578667a63.68 63.68 0 0 1 127.104 0l161.578666 161.578667a32.554667 32.554667 0 0 1-46.037333 46.037333zM565.333333 512a32 32 0 0 1 0 64h-277.333333a32 32 0 0 1 0-64h277.333333z"
                            fill="#EB9E52" p-id="4851"></path>
                        <path
                            d="M853.333333 981.333333H170.666667a85.333333 85.333333 0 0 1-85.333334-85.333333V384a85.333333 85.333333 0 0 1 85.333334-85.333333h682.666666a85.333333 85.333333 0 0 1 85.333334 85.333333v512a85.333333 85.333333 0 0 1-85.333334 85.333333z m21.333334-576a42.666667 42.666667 0 0 0-42.666667-42.666666H192a42.666667 42.666667 0 0 0-42.666667 42.666666v469.333334a42.666667 42.666667 0 0 0 42.666667 42.666666h640a42.666667 42.666667 0 0 0 42.666667-42.666666V405.333333z"
                            fill="#5C8EF3" p-id="4852"></path>
                    </svg>
                    <span>停诊公告</span>
                </div>
                <div class="right">
                    <span>全部</span>
                    <svg t="1688107319374" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="3499" width="16" height="16">
                        <path
                            d="M512 1024C229.248 1024 0 794.752 0 512S229.248 0 512 0s512 229.248 512 512-229.248 512-512 512z m200.746667-478.506667l1.749333-1.664 30.165333-30.165333-330.496-330.581333a42.837333 42.837333 0 0 0-60.288 0 42.538667 42.538667 0 0 0 0 60.330666l270.08 270.165334-270.08 269.952a42.496 42.496 0 0 0 0 60.288c16.64 16.64 43.861333 16.469333 60.288 0.042666l298.581334-298.368z"
                            fill="#3D3D3D" p-id="3500"></path>
                    </svg>
                </div>
            </div>
            <div class="content">
                <ul>
                    <li>关于延长北京大学国际医院放假的通知</li>
                    <li>北京中医大学东方医院部分科室医生门诊</li>
                    <li>武警总医院号源暂停更新通知</li>
                </ul>
            </div>
        </div>
    </div>
</template>

<script setup lang="ts">

</script>

<style scoped lang="scss">
.tip {
    color: #7f7f7f;

    .deparment {
        .header {
            display: flex;
            justify-content: space-between;

            .left {
                display: flex;

                span {
                    margin-left: 5px;
                }
            }
        }

        .content {
            ul {
                display: flex;
                flex-wrap: wrap;
                justify-content: space-between;

                li {
                    width: 40%;
                    margin-top: 20px;
                }
            }
        }
    }

    .notice {
        margin-top: 20px;

        .header {
            display: flex;
            justify-content: space-between;
        }

        .content {
            ul {
                li {
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    margin-top: 20px;
                }
            }
        }
    }
}
</style>